<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <div id="app">
    <h3>年会</h3>
    <h3>年会</h3>
    <h3>年会</h3>
    <h3>年会</h3>
    啊大大
    <span>一堆字符串</span>
  </div>

  <div id="aim"></div>
  <script>
    let f = document.createDocumentFragment()
    let aimEl = document.querySelector('#aim')

    let d = document.querySelector('#app')
    let tempDOM = document.createElement('div')

    // let q = new DOMParser

    // console.log(q.parseFromString(d.innerHTML, 'text/html'))

    tempDOM.innerHTML = d.innerHTML

    // console.log(tempDOM)

    console.log(tempDOM.querySelectorAll('h3'))

    f.appendChild(tempDOM)

    let h3List = f.querySelectorAll('h3')

    console.log(h3List)
    for(let i=0; i<h3List.length; i++) {
      h3List[i].setAttribute('data-loading', 'lazy')
    }

    aimEl.appendChild(f)
  </script>
</body>
</html>